<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style type="text/css">
    #video
    {
        height: 600px;
        width: 600px;
    }
    </style>
</head>
<body>
    <!--
        在网页中引入音视频
    -->
    <!--
        首先引入音频
        audio标签用来向页面中引入一个外部的音频文件
        音频文件引入时，默认情况下不允许用户自己控制播放停止
        所以需要添加属性
        controls 是否允许用户控制播放
        autoplay 音频文件是否自动播放 如果设置了autoplay，则音乐在打开页面时会自动播放
        但是目前来讲大部分浏览器都不会自动对音乐播放
        loop 是否允许歌曲循环播放

        这三个属性都没有值，皆为存在即可生效
    -->
    <audio src="./midea/云雀-ASCA.mp3"  controls loop></audio>
    <!--
        此时虽然引入了音频文件，但是无法显示和播放，需要添加属性controls
        这样文件音频就能正常播放
    -->
    <!--
        引入视频
        video标签来向网页中引入一个视频文件
        用法与audio类似
    -->
    <video src="./midea/Because of you 1080p.mkv" controls id="video"></video>
</body>
</html>